<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>p7_表单练习</title>
</head>
<body>
<!-- name:用来设置选项的名字，没有此值该控件无法提交值
     value:设置输入框的默认值、按钮上显示的文字、单选/多选中选项的值
-->
  <form action="#">
    姓名1：<input type="text" name="uname1" value="tom"><br>
    姓名2：<input type="text" name="uname2" value="tom" readonly><br><!-- readonly值会随着表单提交。-->
    姓名3：<input type="text" name="uname3" value="tom" disabled><br><!-- disabled值不会随着表单提交。-->
    姓名4：<input type="text" name="uname4" maxlength="请输入用户名"><br>
    密码：<input type="password" name="upwd"><br>
    性别：
    <input type="radio" name="gender" value="1">男
    <input type="radio" name="gender" value="0" checked>女
    <br>
    爱好：
    <input type="checkbox" name="like" value="cy">抽烟
    <input type="checkbox" name="like" value="hj">喝酒
    <input type="checkbox" name="like" value="tt" checked>烫头
    <input type="checkbox" name="like" value="java" checked>学Java
    <br>
    生日<input type="date" name="birthday"><br>
    颜色<input type="color" name="lc"><br>
    范围<input type="range" name="sf"><br>
    文件<input type="file" name="uf">
    <br>
    喜欢的城市：
    <select name="city">
      <option value="bj">北京</option>
      <option value="sz">深圳</option>
      <option value="cq" selected>重庆</option>
      <option value="eb">哈尔滨</option>
    </select>
    <br>
    <!-- 效果：点击文字时就可以选中复选框-->
    <input type="checkbox" id="ok">
    <label for="ok">我同意以上协议</label>
    <br>
    <!-- 效果：点击文字时就可以让输入框获得焦点（输入光标I）-->
    <label for="ok2">关联文字</label>
    <input type="text" id="ok2">
    <br>
    <!-- 多行文本域-->
    留言板：
    <textarea name="content" cols="30" rows="3" style="resize:none;">请发言~~~</textarea>
    <br>
    <input type="submit" value="我是提交">
    <input type="reset" value="我是重置">
    <input type="button" value="我暂时没用">
    <button>我是按钮</button>
</form>


</body>
</html>
